<page-header [title]="title">
  <ng-template #title>
    {{l('Settings')}}
    <span class="text-sm text-grey-dark">
      <nz-divider nzType="vertical"></nz-divider>
      {{l('SettingsHeaderInfo')}}
    </span>
  </ng-template>
</page-header>

<nz-card>
  <form nz-form #validateForm="ngForm" (ngSubmit)="saveAll()" autocomplete="off">
    <!-- <nz-tabset *ngIf="hostSettings" [nzTabBarExtraContent]="extraTemplate">
      <nz-tab [nzTitle]="l('General')" *ngIf="showTimezoneSelection">
        <nz-card [nzBordered]="false">
          <nz-form-item nz-row>
            <nz-form-label nzFor="Timezone">
              {{l("Timezone")}}
            </nz-form-label>
            <nz-form-control>
              <timezone-combo [(selectedTimeZone)]="hostSettings.general.timezone" defaultTimezoneScope="{{defaultTimezoneScope}}"></timezone-combo>
            </nz-form-control>
          </nz-form-item>
        </nz-card>
      </nz-tab> -->

      <!-- 租户管理设置 -->
      <!-- <nz-tab [nzTitle]="l('TenantManagement')" *ngIf="hostSettings.tenantManagement">
        <nz-card [nzBordered]="false">
          <h3>{{l("FormBasedRegistration")}}</h3>
          <nz-form-item nz-row>
            <div nz-col><label nz-checkbox name="AllowSelfRegistration" [(ngModel)]="hostSettings.tenantManagement.allowSelfRegistration">{{l("AllowTenantsToRegisterThemselves")}}</label></div>
            <nz-form-extra>{{l("AllowTenantsToRegisterThemselves_Hint")}}</nz-form-extra>
          </nz-form-item>
          <nz-form-item nz-row [hidden]="!hostSettings.tenantManagement.allowSelfRegistration">
            <div nz-col><label nz-checkbox name="IsNewRegisteredTenantActiveByDefault" [(ngModel)]="hostSettings.tenantManagement.isNewRegisteredTenantActiveByDefault">{{l("NewRegisteredTenantsIsActiveByDefault")}}</label></div>
            <nz-form-extra>{{l("NewRegisteredTenantsIsActiveByDefault_Hint")}}</nz-form-extra>
          </nz-form-item> -->
          <!-- 注册租户使用验证码 -->
          <!-- <nz-form-item nz-row [hidden]="!hostSettings.tenantManagement.allowSelfRegistration">
            <div nz-col>
              <label nz-checkbox name="useCaptchaOnTenantRegistration" [(ngModel)]="hostSettings.tenantManagement.useCaptchaOnTenantRegistration">
                {{l("UseCaptchaOnTenantRegistration")}}
              </label>
            </div>
          </nz-form-item> -->
          <!--  注册租户验证码类型 -->
          <!-- <nz-form-item nz-row *ngIf="hostSettings.tenantManagement.allowSelfRegistration&&hostSettings.tenantManagement.useCaptchaOnTenantRegistration">
            <nz-form-label nzFor="captchaOnTenantRegistrationType">
              {{l("CaptchaOnTenantRegistrationType")}}
            </nz-form-label>
            <nz-form-control>
              <nz-select style="width: 120px;" name="captchaOnTenantRegistrationType" [(ngModel)]="hostSettings.tenantManagement.captchaOnTenantRegistrationType">
                <nz-option *ngFor="let option of validateCodeTypes" [nzValue]="option.value" [nzLabel]="option.displayText"></nz-option>
              </nz-select>
            </nz-form-control>
          </nz-form-item> -->
          <!--  注册租户验证码长度 -->
          <!-- <nz-form-item nz-row *ngIf="hostSettings.tenantManagement.allowSelfRegistration&&hostSettings.tenantManagement.useCaptchaOnTenantRegistration">
            <nz-form-label nzFor="captchaOnTenantRegistrationLength">
              {{l("CaptchaOnTenantRegistrationLength")}}
            </nz-form-label>
            <nz-form-control>
              <nz-input-number name="captchaOnTenantRegistrationLength" [(ngModel)]="hostSettings.tenantManagement.captchaOnTenantRegistrationLength"
                [nzMin]="4" [nzMax]="10" [nzStep]="1"></nz-input-number>
            </nz-form-control>
          </nz-form-item> -->

          <!-- <nz-form-item nz-row>
            <nz-form-label nzFor="DefaultEditionId">
              {{l("Edition")}}
            </nz-form-label>
            <nz-form-control>
              <nz-select [(ngModel)]="selectedEditionId" name="DefaultEditionId" nzAllowClear>
                <nz-option *ngFor="let edition of editions" [nzLabel]="edition.displayText" [nzValue]="edition.value"></nz-option>
              </nz-select>
            </nz-form-control>
          </nz-form-item>
        </nz-card>
      </nz-tab> -->

      <!-- 用户设置 -->
      <!-- <nz-tab [nzTitle]="l('UserManagement')" *ngIf="hostSettings.userManagement">
        <nz-card [nzBordered]="false">
          <nz-form-item nz-row>
            <div nz-col><label nz-checkbox name="IsEmailConfirmationRequiredForLogin" [(ngModel)]="hostSettings.userManagement.isEmailConfirmationRequiredForLogin">{{l("EmailConfirmationRequiredForLogin")}}</label></div>
          </nz-form-item> -->
          <!-- <nz-form-item nz-row>
            <div nz-col><label nz-checkbox name="SmsVerificationEnabled" [(ngModel)]="hostSettings.userManagement.smsVerificationEnabled">{{l("SmsVerificationEnabled")}}</label></div>
          </nz-form-item> -->
          <!-- 宿主用户登陆使用验证码 -->
          <!-- <nz-form-item nz-row>
            <div nz-col>
              <label nz-checkbox name="useCaptchaOnUserLogin" [(ngModel)]="hostSettings.userManagement.useCaptchaOnUserLogin">
                {{l("UseCaptchaOnHostUserLogin")}}
              </label>
            </div>
          </nz-form-item> -->
          <!--  宿主用户登陆验证码类型 -->
          <!-- <nz-form-item nz-row *ngIf="hostSettings.userManagement.useCaptchaOnUserLogin">
            <nz-form-label nzFor="captchaOnUserLoginType">
              {{l("CaptchaOnHostUserLoginType")}}
            </nz-form-label>
            <nz-form-control>
              <nz-select style="width: 120px;" name="captchaOnUserLoginType" [(ngModel)]="hostSettings.userManagement.captchaOnUserLoginType">
                <nz-option *ngFor="let option of validateCodeTypes" [nzValue]="option.value" [nzLabel]="option.displayText"></nz-option>
              </nz-select>
            </nz-form-control>
          </nz-form-item> -->
          <!--  宿主用户登陆验证码长度 -->
          <!-- <nz-form-item nz-row *ngIf="hostSettings.userManagement.useCaptchaOnUserLogin">
            <nz-form-label nzFor="captchaOnUserLoginLength">
              {{l("CaptchaOnHostUserLoginLength")}}
            </nz-form-label>
            <nz-form-control>
              <nz-input-number name="captchaOnUserLoginLength" [(ngModel)]="hostSettings.userManagement.captchaOnUserLoginLength"
                [nzMin]="4" [nzMax]="10" [nzStep]="1"></nz-input-number>
            </nz-form-control>
          </nz-form-item>
        </nz-card>
      </nz-tab> -->

      <!-- 安全设置 -->
      <!-- <nz-tab [nzTitle]="l('Security')" *ngIf="hostSettings.security">
        <nz-card [nzBordered]="false">
          <h3>{{l("PasswordComplexity")}}</h3>
          <div nz-row>
            <label nz-checkbox name="Setting_PasswordComplexity_UseDefaultSettings" [(ngModel)]="hostSettings.security.useDefaultPasswordComplexitySettings">{{l("UseDefaultSettings")}}</label>
          </div>
          <div nz-row>
            <label nz-checkbox name="Setting_PasswordComplexity_RequireDigit" [(ngModel)]="hostSettings.security.passwordComplexity.requireDigit"
              [nzDisabled]="hostSettings.security.useDefaultPasswordComplexitySettings">{{l("PasswordComplexity_RequireDigit")}}</label>
          </div>
          <div nz-row>
            <label nz-checkbox name="Setting_PasswordComplexity_RequireLowercase" [(ngModel)]="hostSettings.security.passwordComplexity.requireLowercase"
              [nzDisabled]="hostSettings.security.useDefaultPasswordComplexitySettings">{{l("PasswordComplexity_RequireLowercase")}}</label>
          </div>
          <div nz-row>
            <label nz-checkbox name="Setting_PasswordComplexity_RequireNonAlphanumeric" [(ngModel)]="hostSettings.security.passwordComplexity.requireNonAlphanumeric"
              [nzDisabled]="hostSettings.security.useDefaultPasswordComplexitySettings">{{l("PasswordComplexity_RequireNonAlphanumeric")}}</label>
          </div>
          <div nz-row>
            <label nz-checkbox name="Setting_PasswordComplexity_RequireUppercase" [(ngModel)]="hostSettings.security.passwordComplexity.requireUppercase"
              [nzDisabled]="hostSettings.security.useDefaultPasswordComplexitySettings">{{l("PasswordComplexity_RequireUppercase")}}</label>
          </div>
          <div nz-row>
            <label [ngClass]="{'text-disabled-color':hostSettings.security.useDefaultPasswordComplexitySettings}">{{l("PasswordComplexity_RequiredLength")}}</label>
            <input nz-input type="number" name="RequiredLength" class="form-control" [(ngModel)]="hostSettings.security.passwordComplexity.requiredLength"
              *ngIf="!hostSettings.security.useDefaultPasswordComplexitySettings">
            <input nz-input type="number" name="RequiredLength" class="form-control" [(ngModel)]="hostSettings.security.defaultPasswordComplexity.requiredLength"
              *ngIf="hostSettings.security.useDefaultPasswordComplexitySettings" disabled>
          </div>
          <h3>{{l("UserLockOut")}}</h3>
          <nz-form-item nz-row class="m0">
            <label nz-checkbox name="Setting_UserLockOut_IsEnabled" [(ngModel)]="hostSettings.security.userLockOut.isEnabled">{{l("EnableUserAccountLockingOnFailedLoginAttemts")}}</label>
          </nz-form-item>
          <nz-form-item nz-row *ngIf="hostSettings.security.userLockOut.isEnabled">
            <nz-form-label nzFor="MaxFailedAccessAttemptsBeforeLockout">
              {{l("MaxFailedAccessAttemptsBeforeLockout")}}
            </nz-form-label>
            <nz-form-control>
              <input nz-input type="number" name="MaxFailedAccessAttemptsBeforeLockout" [(ngModel)]="hostSettings.security.userLockOut.maxFailedAccessAttemptsBeforeLockout"
                >
            </nz-form-control>
          </nz-form-item>
          <nz-form-item nz-row *ngIf="hostSettings.security.userLockOut.isEnabled">
            <nz-form-label nzFor="DefaultAccountLockoutSeconds">
              {{l("DefaultAccountLockoutDurationAsSeconds")}}
            </nz-form-label>
            <nz-form-control>
              <input nz-input type="number" name="DefaultAccountLockoutSeconds" [(ngModel)]="hostSettings.security.userLockOut.defaultAccountLockoutSeconds"
               >
            </nz-form-control>
          </nz-form-item>
          <div>
            <h3>{{l("TwoFactorLogin")}}</h3>
            <div nz-row>
              <label nz-checkbox name="Setting_TwoFactorLogin_IsEnabled" [(ngModel)]="hostSettings.security.twoFactorLogin.isEnabled">{{l("EnableTwoFactorLogin")}}</label>
            </div>
            <div nz-row *ngIf="hostSettings.security.twoFactorLogin.isEnabled && !isMultiTenancyEnabled">
              <label nz-checkbox name="Setting_TwoFactorLogin_IsEmailProviderEnabled" [(ngModel)]="hostSettings.security.twoFactorLogin.isEmailProviderEnabled">{{l("IsEmailVerificationEnabled")}}</label>
            </div>
            <div nz-row *ngIf="hostSettings.security.twoFactorLogin.isEnabled && !isMultiTenancyEnabled">
              <label nz-checkbox name="Setting_TwoFactorLogin_IsSmsProviderEnabled" [(ngModel)]="hostSettings.security.twoFactorLogin.isSmsProviderEnabled">{{l("IsSmsVerificationEnabled")}}</label>
            </div>
            <div nz-row *ngIf="hostSettings.security.twoFactorLogin.isEnabled && !isMultiTenancyEnabled">
              <label nz-checkbox name="Setting_TwoFactorLogin_IsGoogleAuthenticatorEnabled" [(ngModel)]="hostSettings.security.twoFactorLogin.isGoogleAuthenticatorEnabled">{{l("IsGoogleAuthenticatorEnabled")}}</label>
            </div>
            <div nz-row *ngIf="hostSettings.security.twoFactorLogin.isEnabled && !isMultiTenancyEnabled">
              <label nz-checkbox name="Setting_TwoFactorLogin_IsRememberBrowserEnabled" [(ngModel)]="hostSettings.security.twoFactorLogin.isRememberBrowserEnabled">{{l("AllowToRememberBrowserForTwoFactorLogin")}}</label>
            </div>
          </div>
        </nz-card>
      </nz-tab> -->

      <!-- 邮箱设置 -->
      <!-- <nz-tab [nzTitle]="l('EmailSmtp')" *ngIf="hostSettings.email">
        <nz-card [nzBordered]="false">
          <nz-form-item nz-row>
            <nz-form-label nzFor="DefaultFromAddress">
              {{l("DefaultFromAddress")}}
            </nz-form-label>
            <nz-form-control nzHasFeedback>
              <input nz-input #defaultFromAddressInput="ngModel" name="DefaultFromAddress" [(ngModel)]="hostSettings.email.defaultFromAddress"
                email maxlength="128">

              <nz-form-explain *ngIf="defaultFromAddressInput.control.dirty&&defaultFromAddressInput.control.errors">
                <ng-container *ngIf="defaultFromAddressInput.control.hasError('required')">{{l('ThisFieldIsRequired')}}</ng-container>
                <ng-container *ngIf="defaultFromAddressInput.control.hasError('minlength')">{{l('MinLength')}}</ng-container>
                <ng-container *ngIf="defaultFromAddressInput.control.hasError('maxlength')">{{l('MaxLength')}}</ng-container>
              </nz-form-explain>

            </nz-form-control>
          </nz-form-item>
          <nz-form-item nz-row>
            <nz-form-label nzFor="DefaultFromDisplayName">
              {{l("DefaultFromDisplayName")}}
            </nz-form-label>
            <nz-form-control nzHasFeedback>
              <input nz-input #defaultFromDisplayNameInput="ngModel" name="DefaultFromDisplayName" [(ngModel)]="hostSettings.email.defaultFromDisplayName"
                maxlength="128">
              <nz-form-explain *ngIf="defaultFromDisplayNameInput.control.dirty&&defaultFromDisplayNameInput.control.errors">
                <ng-container *ngIf="defaultFromDisplayNameInput.control.hasError('required')">{{l('ThisFieldIsRequired')}}</ng-container>
                <ng-container *ngIf="defaultFromDisplayNameInput.control.hasError('minlength')">{{l('MinLength')}}</ng-container>
                <ng-container *ngIf="defaultFromDisplayNameInput.control.hasError('maxlength')">{{l('MaxLength')}}</ng-container>
              </nz-form-explain>
            </nz-form-control>
          </nz-form-item>
          <nz-form-item nz-row>
            <nz-form-label nzFor="SmtpHost">
              {{l("SmtpHost")}}
            </nz-form-label>
            <nz-form-control nzHasFeedback>
              <input nz-input #smtpHostInput="ngModel" name="SmtpHost" [(ngModel)]="hostSettings.email.smtpHost"
                required maxlength="64">
              <nz-form-explain *ngIf="smtpHostInput.control.dirty&&smtpHostInput.control.errors">
                <ng-container *ngIf="smtpHostInput.control.hasError('required')">{{l('ThisFieldIsRequired')}}</ng-container>
                <ng-container *ngIf="smtpHostInput.control.hasError('minlength')">{{l('MinLength')}}</ng-container>
                <ng-container *ngIf="smtpHostInput.control.hasError('maxlength')">{{l('MaxLength')}}</ng-container>
              </nz-form-explain>
            </nz-form-control>
          </nz-form-item>
          <nz-form-item nz-row>
            <nz-form-label nzFor="SmtpPort">
              {{l("SmtpPort")}}
            </nz-form-label>
            <nz-form-control>
              <input nz-input type="number" #smtpPortInput="ngModel" name="SmtpPort" [(ngModel)]="hostSettings.email.smtpPort">
              <nz-form-explain *ngIf="smtpPortInput.control.dirty&&smtpPortInput.control.errors">
                <ng-container *ngIf="smtpPortInput.control.hasError('required')">{{l('ThisFieldIsRequired')}}</ng-container>
                <ng-container *ngIf="smtpPortInput.control.hasError('minlength')">{{l('MinLength')}}</ng-container>
                <ng-container *ngIf="smtpPortInput.control.hasError('maxlength')">{{l('MaxLength')}}</ng-container>
              </nz-form-explain>
            </nz-form-control>
          </nz-form-item>
          <nz-form-item nz-row>
            <div nz-col><label nz-checkbox name="SmtpEnableSsl" [(ngModel)]="hostSettings.email.smtpEnableSsl">{{l("UseSsl")}}</label></div>
          </nz-form-item>
          <nz-form-item nz-row>
            <div nz-col><label nz-checkbox name="SmtpUseDefaultCredentials" [(ngModel)]="hostSettings.email.smtpUseDefaultCredentials">{{l("UseDefaultCredentials")}}</label></div>
          </nz-form-item>
          <nz-form-item nz-row [hidden]="hostSettings.email.smtpUseDefaultCredentials">
            <nz-form-label nzFor="SmtpDomainName">
              {{l("DomainName")}}
            </nz-form-label>
            <nz-form-control nzHasFeedback>
              <input nz-input #smtpDomainNameInput="ngModel" name="SmtpDomainName" [(ngModel)]="hostSettings.email.smtpDomain"
                maxlength="128">
              <nz-form-explain *ngIf="smtpDomainNameInput.control.dirty&&smtpDomainNameInput.control.errors">
                <ng-container *ngIf="smtpDomainNameInput.control.hasError('required')">{{l('ThisFieldIsRequired')}}</ng-container>
                <ng-container *ngIf="smtpDomainNameInput.control.hasError('minlength')">{{l('MinLength')}}</ng-container>
                <ng-container *ngIf="smtpDomainNameInput.control.hasError('maxlength')">{{l('MaxLength')}}</ng-container>
              </nz-form-explain>
            </nz-form-control>
          </nz-form-item>
          <nz-form-item nz-row [hidden]="hostSettings.email.smtpUseDefaultCredentials">
            <nz-form-label nzFor="SmtpUserName">
              {{l("UserName")}}
            </nz-form-label>
            <nz-form-control nzHasFeedback>
              <input nz-input #smtpUserNameInput="ngModel" name="SmtpUserName" [(ngModel)]="hostSettings.email.smtpUserName"
                maxlength="128">
              <nz-form-explain *ngIf="smtpUserNameInput.control.dirty&&smtpUserNameInput.control.errors">
                <ng-container *ngIf="smtpUserNameInput.control.hasError('required')">{{l('ThisFieldIsRequired')}}</ng-container>
                <ng-container *ngIf="smtpUserNameInput.control.hasError('minlength')">{{l('MinLength')}}</ng-container>
                <ng-container *ngIf="smtpUserNameInput.control.hasError('maxlength')">{{l('MaxLength')}}</ng-container>
              </nz-form-explain>
            </nz-form-control>
          </nz-form-item>
          <nz-form-item nz-row [hidden]="hostSettings.email.smtpUseDefaultCredentials">
            <nz-form-label nzFor="SmtpPassword">
              {{l("Password")}}
            </nz-form-label>
            <nz-form-control nzHasFeedback>
              <input nz-input type="password" #smtpPasswordInput="ngModel" name="SmtpPassword" [(ngModel)]="hostSettings.email.smtpPassword"
                maxlength="128">
              <nz-form-explain *ngIf="smtpPasswordInput.control.dirty&&smtpPasswordInput.control.errors">
                <ng-container *ngIf="smtpPasswordInput.control.hasError('required')">{{l('ThisFieldIsRequired')}}</ng-container>
                <ng-container *ngIf="smtpPasswordInput.control.hasError('minlength')">{{l('MinLength')}}</ng-container>
                <ng-container *ngIf="smtpPasswordInput.control.hasError('maxlength')">{{l('MaxLength')}}</ng-container>
              </nz-form-explain>
            </nz-form-control>
          </nz-form-item>
          <hr />
          <h3>{{l("TestEmailSettingsHeader")}}</h3>
          <nz-input-group nzSearch [nzSuffix]="suffixButton">
            <input type="text" nz-input [(ngModel)]="testEmailAddress" name="TestEmailAddress">
          </nz-input-group>
          <ng-template #suffixButton>
            <button nz-button type="button" nzType="primary" nzSearch (click)="sendTestEmail()" [nzLoading]="sendMailTest">
              {{l("SendTestEmail")}}
            </button>
          </ng-template>
        </nz-card>
      </nz-tab>
    </nz-tabset> -->
    <ng-template #extraTemplate>
      <button nz-button [nzType]="'primary'" type="submit">
        <i nz-icon type="save"></i> {{l("SaveAll")}}
      </button>
    </ng-template>
  </form>
</nz-card>
